<template>
	<view>
		<label >
			<radio :checked="selectAll" @click="checkAll" color="#c00"/><text>全选</text>
		</label>
		<view class="list" v-for="item,index in list" :key="index">
			<label >
				<radio :checked="item.status" @click="checks(index)" color="#c00"/><text>单选</text>
			</label>
			<text>{{item.title}}</text>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				selectAll:false,//全选按钮的初始状态
				list:[{'title':'女装',status:false},{'title':'彩妆',status:false},{'title':'母婴',status:false},{'title':'数码',status:false}]
			};
		},
		methods:{
			checkAll(){
				// 手动取反
				this.selectAll = !this.selectAll
				console.log(this.selectAll);
				this.list.forEach(item=>{
					item.status = this.selectAll
				})
				
			},
			// 点击单选
			 checks(i){
				 // 手动取反
				 this.list[i].status = !this.list[i].status
				 this.selectAll = this.list.every(item=>item.status)
				 
				 
			 }
		}
	}
</script>

<style lang="scss">

</style>
